import { Component } from 'react';
import './Interval.less';
import Select from 'uxcore-select2';
import Columnchart from 'components/columnchart';
const Option = Select.Option;
const data1 = {
  xText: '间隔率(%)',
  unit:'%',
  xAxis: ['线路1', '线路2', '线路3', '线路4', '线路5', '线路6', '线路7', '线路8', '线路9'],
  yAxis: [
    {
      name: '昨天',
      color: '#2087EB',
      // data: [70, 65, 90, 67, 58, 90, 67, 34, 56]
      data:[]
    }, {
      name: '今天',
      color: '#FFA525',
      // data: [40, 54, 78, 45, 81, 78, 20, 40, 31]
      data:[]
    }
  ]
}

export default class Interval extends Component {

  constructor(props) {
    super(props);
    this.state = {
      data: data1,
      area: ''
    }
  }

  selectChange(value) {
    this.setState({ area: value });
  }


  render() {
    let { data } = this.state;
    return (
      <div className="mod-interval">
        <Select defaultValue="拱墅区" style={{ width: 90 }} dropdownClassName="kuma-select2-selected-has-icon" onChange={this.selectChange.bind(this)}>
          <Option value="拱墅区">拱墅区</Option>
          <Option value="西湖区">西湖区</Option>
          <Option value="上城区">上城区</Option>
        </Select>
        <Columnchart data={data} />
      </div>
    );
  }
}
